﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="simple_sample.aspx.cs" Inherits="GoogleMapAPI.simple_sample" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
   <title>Maps Data API JavaScript Sample</title>
  <script type="text/javascript" src="http://www.google.com/jsapi?key=ABQIAAAAsc0UQXoo2BnAJLhtpWCJFBRtpBalue-XiU0nXijyxJOFOqsHnxRGD0o9IFUpzzG944F17kJozXrQzQ"></script>
  <%--<script type="text/javascript" src="js/simple_sample.js"></script>--%>
  <script src="js/jquery-1.4.1.min.js" type="text/javascript"></script>
  <script type="text/javascript" src="js/mymaps.js"></script>
  
  <script type="text/javascript">
      $(document).ready(function () {

          var exdate = new Date()
          exdate.setDate(exdate.getDate() + 20)

          google.load('gdata', '2.x', { packages: ['maps'] });
          //document.cookie = "g314-scope-0=scope=https%3A%2F%2Fmaps.google.com%2Fmaps%2Ffeeds%2F&token=2%2FpTC1UlR_QYibYGFHmwnceKmXKiq_QyPY9kPFQkqunow;expires=" + exdate.toString();
          //google.setOnLoadCallback(init);
      
      });
  </script>
</head>
<body>
    <form id="form1" runat="server">
       <!-- for JS GData/AuthSub -->
      <img src="dot_clear.gif" style="display: none"/>

      <div id="errors" style="color: #f00; font-weight: bold; display: none"></div>

      <div id="state-guest" style="display: none">
        <a href="#" onclick="login(); return false;">Login</a>
      </div>
  
      <div id="state-loggedin" style="display: none">
        <a href="#" onclick="logout(); return false;">Logout</a>
  
        <h3>List of Maps:</h3>
        <ul id="map-list"></ul>
  
        <h3>Features in this map:</h3>
        <ul id="feature-list"></ul>
  
        <h3>KML of this feature:</h3>
        <textarea id="feature-kml" cols="40" rows="7"
                  style="width: 100%; height: 300px"></textarea>
      </div>
      <input  type="text" style=" width:300px; height:200px;" class="maphref"/><br />
      <div id="canvas" style=" width:500px; height:400px; background-color:Gray;">
      </div>
      <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
      <script type="text/javascript">
          var map; 
          $(document).ready(function () {
              var defultMapOptions = {
                  zoom: 4, 
                  center: new google.maps.LatLng(39.90555, 116.39147),
                  mapTypeId: google.maps.MapTypeId.ROADMAP,
                  mapTypeControl: true
              };
              var kml = "<?xml version='1.0' encoding='UTF-8'?><Placemark xmlns='http://www.opengis.net/kml/2.2'><name>OK</name><description><![CDATA[ThanksI want go to <a href=\"http://www.google.com\">Google</a>]]></description><Style><IconStyle><Icon><href>http://maps.gstatic.com/intl/zh-CN_cn/mapfiles/ms/micons/blue-dot.png</href></Icon></IconStyle></Style><Point><coordinates>93.603516,41.902277,0.0</coordinates></Point></Placemark>"

              map = new google.maps.Map($("#canvas").get(0), defultMapOptions);
//              var xmlDoc = $(loadXML(kml));
//              var icon = xmlDoc.find('href').text();
//              var coordinate = xmlDoc.find('coordinates').text();
//              var allCoors = coordinate.split(',');
//              var position = new google.maps.LatLng(allCoors[1], allCoors[0]);
//              var maker = new google.maps.Marker({ icon: icon, map: map, position: position });
//              if (0 == 0) {
//                  map.setCenter(position);
//              } 
          });
      </script>
    </form>
</body>
</html>
